<template>
    <div>
        <el-menu
                style="width: 200px ; min-height: calc(100vh - 50px)"
                :default-active="path"
                router
                class="el-menu-vertical-demo">
            <el-sub-menu index="1" v-if="this.user.role === 0">
                <template #title><i class="mdui-icon material-icons">settings</i>&nbsp;&nbsp;系统管理</template>
                <el-menu-item index="/user"><i class="mdui-icon material-icons">person</i>&nbsp;&nbsp;用户管理</el-menu-item>
            </el-sub-menu>
            <el-menu-item index="/house"><i class="mdui-icon material-icons">home</i>&nbsp;&nbsp;{{ houseAside }}</el-menu-item>
            <el-menu-item index="/wantRent" v-if="this.user.role === 2"><i class="mdui-icon material-icons">description</i>&nbsp;&nbsp;我提交的申请</el-menu-item>
        </el-menu>
    </div>
</template>

<script>
    import request from "../utils/request";

    export default {
        name: "Aside",
        data() {
            return {
                user: {},
                path: this.$route.path, //设置默认高亮的菜单
                houseAside: '',
            }
        },
        created() {
            let userStr = sessionStorage.getItem("user") || "{}";
            this.user = JSON.parse(userStr);

            //请求服务端，确认当前登录用户的合法信息
            request.get("/user/" + this.user.id).then(res => {
                if (res.code === '0'){
                    this.user = res.data;
                }
            });

            if (this.user.role === 1) {  //登陆的是房主
                this.houseAside = '我的房屋';
            } else if (this.user.role === 2) {
                this.houseAside = '待出租房屋';
            } else {
                this.houseAside = '房屋管理';
            }

        },

    }
</script>

<style scoped>

</style>